<template>
    <div>
        <!-- 搜索区 -->
        <el-form :inline="true" size="small" ref="form" label-width="80px" >
            <el-form-item label="物品类型">
                <el-select v-model="params.type" placeholder="请选择" clearable>
                    <el-option v-for="item in goods" :key="item.id" :label="item.name" :value="item.name"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="关键字">
                <el-input v-model="params.name" placeholder="请输入关键字" clearable></el-input>
            </el-form-item>
            <el-form-item>
                 <!-- <el-button size="small" type="primary" @click="queryReceives(params)">入库</el-button> -->
            </el-form-item>
        </el-form>
        <!-- 表格 -->
        <el-table :data="reveive.list" border style="width: 100%" size="small">
            <el-table-column type="index" label="序号" width="80"></el-table-column>
            <el-table-column prop="baseUser.realname" label="申请人"></el-table-column>
            <el-table-column prop="asset.code" label="物品编码"></el-table-column>
            <el-table-column prop="asset.name" label="物品名称"></el-table-column>
            <el-table-column prop="asset.type" label="物品类型"></el-table-column>
            <el-table-column prop="type" label="申请类别"></el-table-column>
            <el-table-column prop="asset.brand" label="品牌"></el-table-column>
            <el-table-column prop="num" label="数量"></el-table-column>
            <el-table-column prop="estimatedPrice" label="预计单价"></el-table-column>
            <el-table-column prop="estimatedTotal" label="预计总价"></el-table-column>
            <el-table-column prop="estimatedReturnTime" label="预计使用时间" width="150">
                <template slot-scope="scope">
                    {{scope.row.estimatedReturnTime | dateFormat}}
                </template>
            </el-table-column>
            <el-table-column label="状态" align="center" width="120">
                <template slot-scope="scope">
                    <el-tag size="small">{{scope.row.checkStatus}}</el-tag>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script>
import qs from 'qs'
export default {
    data() {
        return {
            goods: [],
            params: {   
                page: 1,
                pageSize: 10,
                checkStatus: '通过',
                applyforType: '申购'
            },
            reveive:[],
            userInfo: []
        }
    },
    mounted() {
        // 根据token获取用户信息
        this.InfoByToken()
    },
    created() {
        // 查询所有物品类型
        this.findAllGoods()
        setTimeout(() => {
            // 分页查询申领信息
            this.queryReceives(this.params)
        },500)
        
    },
    watch: {
        params: {
            handler: function() {
                this.queryReceives(this.params)
            },
            deep: true
        }
    },
    methods: {
        // 根据token获取用户信息
        InfoByToken() {
            var token = localStorage.getItem('token')
            this.axios({
                type:"get",
                url:"http://39.96.21.48:8888/user/info",
                headers: {
                "Authorization":token
                },
                params: {token}
            }).then(res => {
                this.userInfo = res.data.data
            })
        },
        // 分页查询申领信息
        queryReceives() {
            // this.params.userId = this.userInfo.id
            this.axios.post("/applyfor/pageQuery",qs.stringify(this.params)).then(res => {
                this.reveive = res.data.data
            })
        },
        // 查询所有物品类型
        findAllGoods() {
            this.axios.get("/assetType/findAll").then(res => {
                this.goods = res.data.data
            })
        },
    }
}
</script>

